{extend name="member/common/main"}

{block name="content"}

<link href="__STATIC__/home/css/vip_form.css" rel="stylesheet"/>

<link rel="stylesheet" href="__STATIC__/plugins/layui/css/layui.css" media="all" />
<script type="text/javascript" src="__STATIC__/plugins/layui/layui.js"></script>

<script type="text/javascript" src="__STATIC__/admin/js/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="__STATIC__/admin/js/ueditor/ueditor.all.min.js"></script>

<div class="vip_contentmain">
  <div class="vip_content">    
    {include file="member/common/left" /}
    <form class="layui-form"  onsubmit="return false" autocomplete="off" lay-filter="form">
    <div class="information Fright">
      <div class="information_title">传承人信息</div>
        <div class="Fleft">
            {if condition="$vo"}
                {if condition="$vo['status'] eq '0'"}
                    信息已经提交，等待管理员审核
                {else /}
                <div class="layui-form-item text-center">
                    <button id="client-btn" class="layui-btn layui-btn-danger" type='submit'>去管理</button>
                </div>
                {/if}
            {else /}
            <!-- <form class="layui-form layui-box" style='padding:25px 30px 20px 0' action="{:url()}" data-auto="true" method="post"> -->
            
                <div class="layui-form-item">
                    <label class="layui-form-label">传承技能</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="inheritor" value='{$vo.inheritor|default=""}' required="required" title="请输入传承技能" placeholder="请输入传承技能" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">传承弟子</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="inheritors" value='{$vo.inheritors|default=""}' required="required" title="请输入传承弟子" placeholder="请输入传承弟子" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">传承人名称</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="truename" value='{$vo.truename|default=""}' required="required" title="请输入传承人名称" placeholder="请输入传承人名称" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">性别</label>
                    <div class="layui-input-block">
                        <input name="sex" value="1" title="男" {eq name='1' value='$vo.sex|default=1'}checked=""{/eq} type="radio">
                        <input name="sex" value="2" title="女" {eq name='2' value='$vo.sex|default=2'}checked=""{/eq} type="radio">
                        <input name="sex" value="0" title="未知" {eq name='0' value='$vo.sex|default=0'}checked=""{/eq} type="radio">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">工作职称</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="title" value='{$vo.title|default=""}' required="required" title="请输入工作职称" placeholder="请输入工作职称" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <!-- <div class="layui-form-item"> -->
                        <label class="layui-form-label">工作开始时间</label>
                        <div class="layui-input-block">
                            <input name="work_start" lay-verify="required" class="layui-input" value="{$vo.work_start|default=''}" placeholder="工作开始时间" id="work_start">
                        </div>
                    <!-- </div> -->
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">毕业院校</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="university" value='{$vo.university|default=""}' required="required" title="请输入毕业院校" placeholder="请输入毕业院校" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">专业</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="profession" value='{$vo.profession|default=""}' required="required" title="请输入专业" placeholder="请输入专业" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">学历</label>
                    <div class="layui-input-block">
                        <input name="education" value="1" title="中学" {eq name='1' value='$vo.education|default=1'}checked=""{/eq} type="radio">
                        <input name="education" value="2" title="专科" {eq name='2' value='$vo.education|default=2'}checked=""{/eq} type="radio">
                        <input name="education" value="3" title="本科" {eq name='3' value='$vo.education|default=3'}checked=""{/eq} type="radio">
                        <input name="education" value="4" title="硕士及以上" {eq name='4' value='$vo.education|default=4'}checked=""{/eq} type="radio">
                        <input name="education" value="0" title="小学及以下" {eq name='0' value='$vo.education|default=0'}checked=""{/eq} type="radio">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">专业证书</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="profession_cert" value='{$vo.profession_cert|default=""}' required="required" title="请输入专业证书" placeholder="请输入专业证书" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">职业证书</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="occupation_cert" value='{$vo.occupation_cert|default=""}' required="required" title="请输入职业证书" placeholder="请输入职业证书" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">手机号码</label>
                    <div class="layui-input-block">
                        <input type="tel" lay-verify="required" name="phone" value='{$vo.phone|default=""}' pattern="^1[3-9][0-9]{9}$" title="请输入手机号码" placeholder="请输入手机号码" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">邮箱</label>
                    <div class="layui-input-block">
                        <input type="text" name="mail" pattern="^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$" value='{$vo.mail|default=""}' title="请输入邮箱" placeholder="请输入邮箱" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">职位名称</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="title" value='{$vo.title|default=""}' required="required" title="请输入职位名称" placeholder="请输入职位名称" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">单位名称</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="unit_name" value='{$vo.unit_name|default=""}' required="required" title="请输入单位名称" placeholder="请输入单位名称" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">头像</label>
                    <div class='layui-input-block'>
                        <img id="demo1" width="200px" data-tips-image src="{$vo.avatar|default='/static/admin/theme/default/img/image.png'}"/>
                        <input id="demo2" type="hidden" name="avatar" onchange="$(this).prev('img').attr('src', this.value)" value="{$vo.avatar|default=''}" class="layui-input">
                        <button type="button" class="layui-btn layui-btn-sm" id="test1">上传图片</button>
                        <p id="demoText"></p>
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">身份证号码</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="id_no" value='{$vo.id_no|default=""}' required="required" title="请输入身份证号码" placeholder="请输入身份证号码" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">身份证件照片</label>
                    <div class="layui-upload" id="full">
                        <input id="picsPath" type="hidden" value='' class="layui-input">
                        <button type="button" class="layui-btn" id="id_images1">点击上传</button>
                        <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;width: 91%; margin-left: 110px;">预览图：
                            <div class="layui-upload-list uploader-list" style="overflow: auto;" id="id_images2">
                                {if !empty($vo['id_images'])}
                                {volist name="vo['id_images']" id="list"}
                                <div class="file-iteme">
                                    <div class="handle"><i class="glyphicon glyphicon-trash"></i></div>
                                    <input type="hidden" name="id_images[]" value='{$list|default=""}' class="layui-input">
                                    <img style="width: 100px;height: 100px;" src='{$list|default=""}'>
                                    <i class="delimg layui-icon">ဆ</i>
                                </div>
                                {/volist}
                                {/if}
                            </div>
                        </blockquote>
                    </div>
                </div>
            
            
                <div class="layui-form-item">
                    <label class="layui-form-label">执业证书编号</label>
                    <div class="layui-input-block">
                        <input type="text" lay-verify="required" name="cert_no" value='{$vo.cert_no|default=""}' required="required" title="请输入执业证书编号" placeholder="请输入执业证书编号" class="layui-input">
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">执业证书照片</label>
                    <div class="layui-upload" id="full">
                        <input id="picsPath" type="hidden" value='' class="layui-input">
                        <button type="button" class="layui-btn" id="cert_images1">点击上传</button>
                        <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;width: 91%; margin-left: 110px;">预览图：
                            <div class="layui-upload-list uploader-list" style="overflow: auto;" id="cert_images2">
                                {if !empty($vo['cert_images'])}
                                {volist name="vo['id_images']" id="list"}
                                <div class="file-iteme">
                                    <div class="handle"><i class="glyphicon glyphicon-trash"></i></div>
                                    <input type="hidden" name="cert_images[]" value='{$list|default=""}' class="layui-input">
                                    <img style="width: 100px;height: 100px;" src='{$list|default=""}'>
                                    <i class="delimg layui-icon">ဆ</i>
                                </div>
                                {/volist}
                                {/if}
                            </div>
                        </blockquote>
                    </div>
                </div>
            
                {if !empty($areaList)}
                <div class="layui-form-item">
                    <label class="layui-form-label">地区</label>
                    <div class="layui-input-block">
                        <select name='aid' required="required" title="请选择地区" class='layui-select full-width'>
                            <option value="">请选择地区</option>
                            {foreach $areaList as $menu}
                            {eq name='menu.area_id' value='$vo.aid|default=0'}
                            <option selected  value='{$menu.area_id}'>{$menu.spl}{$menu.area_name}</option>
                            {else/}
                            <option  value='{$menu.area_id}'>{$menu.spl}{$menu.area_name}</option>
                            {/eq}
                            {/foreach}
                        </select>
                    </div>
                </div>
                {/if}
            
                {if !empty($nationList)}
                <div class="layui-form-item">
                    <label class="layui-form-label">民族</label>
                    <div class="layui-input-block">
                        <select name='nid' required="required" title="请选择民族" class='layui-select full-width'>
                            <option value="">请选择民族</option>
                            {foreach $nationList as $menu}
                            {eq name='menu.id' value='$vo.nid|default=0'}
                            <option selected  value='{$menu.id}'>{$menu.spl}{$menu.title}</option>
                            {else/}
                            <option  value='{$menu.id}'>{$menu.spl}{$menu.title}</option>
                            {/eq}
                            {/foreach}
                        </select>
                    </div>
                </div>
                {/if}
            
                <div class="layui-form-item">
                    <label class="layui-form-label">简介</label>
                    <div class="layui-input-block">
                        <textarea placeholder="请输入简介" title="请输入简介" class="layui-textarea" name="desc">{$vo.desc|default=""}</textarea>
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">荣誉</label>
                    <div class="layui-input-block">
                        <textarea placeholder="请输入荣誉,多条请以回车换行分隔" title="请输入荣誉" class="layui-textarea" name="honor">{$vo.honor|default=""}</textarea>
                    </div>
                </div>
            
                <div class="layui-form-item">
                    <label class="layui-form-label">擅长领域</label>
                    <div class="layui-input-block">
                        <textarea placeholder="请输入擅长领域,多条请以回车换行分隔" title="请输入擅长领域" class="layui-textarea" name="advantage">{$vo.advantage|default=""}</textarea>
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">详情</label>
                    <div class="layui-input-block" style="z-index:998;">
                        <script id="content" name="content" type="text/plain">
                            
                        </script>
                    </div>
                </div>            
            
                <div class="hr-line-dashed"></div>
            
                <div class="layui-form-item text-center">
                    <input type="hidden" id="v-content" value='{$vo.content|default=""}'>
                    {if isset($vo['id'])}<input type='hidden' value='{$vo.id}' name='id'/>{/if}
                    <button id="subtn" lay-submit="" lay-filter="sub" class="layui-btn layui-btn-danger" type='submit'>提交</button>
                </div>
            <!-- </form> -->
            {/if}
      </div>      
    </div>
    </form>
    <script>
      // window.form.render();
      // window.laydate.render({range: false, elem: '#birth'});
      </script>
  </div>
</div>
{/block}


{block name="script"}
<script type="text/javascript">
layui.use(['layer', 'form', 'upload', 'laydate'], function(){
  var layer = layui.layer
  ,form = layui.form
  ,upload = layui.upload
  ,laydate = layui.laydate;
  
//   form.render();
//   laydate.render({range: false, elem: '#birth'});
            
    //日期
    laydate.render({
        elem: '#work_start'
        , max: '2099-06-16'
    });

    $('.layui-upload').on('click','.delimg',function(){
    var thisimg = $(this);

        layer.confirm('你确定要删除该图片吗？', function(index){
            thisimg.parents('.file-iteme').remove();
            layer.close(index);
        })
    })

    var ue1 = UE.getEditor('content');
        ue1.ready(function() {
        ue1.setHeight(200);
        var cont = $("#v-content").val();
        // alert(cont);return false;
        ue1.setContent(cont);
    });
    
    $('#client-btn').on("click", function(event){
        window.open("{:url('client/index/index')}");
    });
  
  //自定义验证规则
  form.verify({
    inheritor: function(value){
      if(value.length < 1){
        return '请输入传承技能';
      }
    },
    truename: function(value){
      if(value.length < 1){
        return '请输入姓名';
      }
    }
    ,idcard: function(value){
      if(value.length < 1){
        return '请输入身份证号码';
      }
    }
    ,phone: function(value){
      if(value.length < 1){
        return '请输入手机号码';
      }
    }
    ,sex: function(value){
      if(value.length < 1){
        return '请选择性别';
      }
    }
    ,aid: function(value){
      if(value.length < 1){
        return '请选择地区';
      }
    }
    ,avatar: function(value){
      if(value.length < 1){
        return '请上传头像';
      }
    }
  });

    //监听提交
  form.on('submit(sub)', function(data){
    delete data.field.file;
      console.log(data.field);
    //   return false;
    $.post('/home/member.client/apply', data.field, function(d){
      console.log(d);
      // return false;
      if(d.code == 1){
        layer.msg(d.msg, {icon:1});
        window.location.href = d.url;
      }else{
        layer.msg(d.msg, {icon:5});
      }
    });
    return false;
  });
  
  //普通图片上传
  var uploadInst = upload.render({
    elem: '#test1'
    ,url: '/admin/up_files/file' //改成您自己的上传接口
    ,before: function(obj){
      //预读本地文件示例，不支持ie8
      obj.preview(function(index, file, result){
        $('#demo1').attr('src', result); //图片链接（base64）
      });
    }
    ,done: function(res){
      // console.log(res);
      // return false;
      //如果上传失败
      if(res.code == 0){
        return layer.msg('上传失败');
      }
      //上传成功
        $('#demo2').attr('value', res.url); //图片链接（base64）
    }
    ,error: function(){
      //演示失败状态，并实现重传
      var demoText = $('#demoText');
      demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
      demoText.find('.demo-reload').on('click', function(){
        uploadInst.upload();
      });
    }
  });

  //多图片上传
upload.render({
    elem: '#id_images1'
    ,url: '{:url("/admin/up_files/upImages")}'
    ,multiple: true
    ,before: function(obj){
        layer.msg('图片上传中...', {
            icon: 16,
            shade: 0.01,
            time: 0
        })
    }
    ,done: function(res){
        //console.log(res);
        layer.close(layer.msg());//关闭上传提示窗口
        //上传完毕
        if(res.code == 1){
            // $("#picsPath").val(res.src);
            var str ='<div class="file-iteme">' +
                    '<div class="handle"><i class="glyphicon glyphicon-trash"></i></div>' +
                    '<input type="hidden" name="id_images[]" value="'+res.src+'" class="layui-input">' +
                    '<img style="width: 100px;height: 100px;" src='+ res.src +'>' +
                    '</div>'
            $('#id_images2').append(str);
        }else{
            layer.msg(res.msg,{time:1000,icon:2});
        } 
    }
});

//多图片上传
upload.render({
  elem: '#cert_images1'
  ,url: '{:url("/admin/up_files/upImages")}'
  ,multiple: true
  ,before: function(obj){
      layer.msg('图片上传中...', {
          icon: 16,
          shade: 0.01,
          time: 0
      })
  }
  ,done: function(res){
      //console.log(res);
      layer.close(layer.msg());//关闭上传提示窗口
      //上传完毕
      if(res.code == 1){
          // $("#picsPath").val(res.src);
          var str ='<div class="file-iteme">' +
                  '<div class="handle"><i class="glyphicon glyphicon-trash"></i></div>' +
                  '<input type="hidden" name="cert_images[]" value="'+res.src+'" class="layui-input">' +
                  '<img style="width: 100px;height: 100px;" src='+ res.src +'>' +
                  '</div>'
          $('#cert_images2').append(str);
      }else{
          layer.msg(res.msg,{time:1000,icon:2});
      } 
  }
});

$(document).on("mouseenter mouseleave", ".file-iteme", function(event){
    if(event.type === "mouseenter"){
        //鼠标悬浮
        //$(this).children(".info").fadeIn("fast");
        $(this).children(".handle").fadeIn("fast");
    }else if(event.type === "mouseleave") {
        //鼠标离开
        //$(this).children(".info").hide();
        $(this).children(".handle").hide();
    }
});

// 删除图片
$(document).on("click", ".file-iteme .handle", function(event){
    $(this).parent().remove(); 
});
  
});
</script>

{/block}